import React, { useState, useEffect } from "react";
import { Card, Row, Col, Descriptions, Badge, Menu } from 'antd';
import { getPlatformAcctInfoList } from './service'
const PlatformAccountInfo = () => {
    const [platformAcctInfo, setPlatformAcctInfo] = useState({})

    useEffect(() => {
        getPlatformAcctInfoList({}).then(res => {
            console.log(res.body);
            console.log(res.body.acName);

            setPlatformAcctInfo(res.body)
        })
    }, []);

    return (
        <Card>
            <Row>
                {/* 左导航 */}
                <Col span={4}>
                    <Menu mode="inline" defaultSelectedKeys={['1']}>
                        <Menu.Item key='1'>平台账户信息</Menu.Item>
                    </Menu>
                </Col>
                {/* 右布局 */}
                <Col span={20} style={{ paddingLeft: 40 }}>
                    <Descriptions title="平台账户信息" layout="vertical" labelStyle={{ color: "#777" }} style={{ marginTop: 12 }}>
                        <Descriptions.Item label="客户号">缺少</Descriptions.Item>
                        <Descriptions.Item label="账号">{platformAcctInfo.acNo}</Descriptions.Item>
                        <Descriptions.Item label="账号名称">{platformAcctInfo.acName}</Descriptions.Item>
                        <Descriptions.Item label="账号余额">{platformAcctInfo.balance} {platformAcctInfo.ccy}</Descriptions.Item>
                        <Descriptions.Item label="在途余额">缺少</Descriptions.Item>
                        <Descriptions.Item label="账号状态">
                            {
                                platformAcctInfo.status === '0' ?
                                    <Badge status="processing" text="正常"></Badge> :
                                    platformAcctInfo.status === '1' ?
                                        <Badge status="default" text="未激活"></Badge> :
                                        platformAcctInfo.status === '2' ?
                                            <Badge status="warning" text="挂失"></Badge> :
                                            platformAcctInfo.status === '3' ?
                                                <Badge status="error" text="冻结"></Badge> :
                                                <Badge status="default" text="销户" />
                            }
                        </Descriptions.Item>
                        <Descriptions.Item label="开户日期">{platformAcctInfo.openAcDate}</Descriptions.Item>
                    </Descriptions>

                </Col>
            </Row>
        </Card>
    )
}
export default PlatformAccountInfo